import React, { useState, useEffect } from 'react';
import axios from 'axios';
import PersonalInfoForm from './PersonalInfoForm';
import EducationInfoForm from './EducationInfoForm';
import AcademicOrganizationsForm from './AcademicOrganizationsForm';
import CurrentQualificationsForm from './CurrentQualificationsForm';
import IndustryQualificationsForm from './IndustryQualificationsForm';
import SocialPositionsForm from './SocialPositionsForm';
import AwardsForm from './AwardsForm';
import PunishmentsForm from './PunishmentsForm';
import WorkExperienceForm from './WorkExperienceForm';
import ContinuingEducationForm from '././ContinuingEducationForm';
import AcademicAchievementsForm from './AcademicAchievementsForm';
import WorkAchievementsForm from './WorkAchievementsForm';
import WorkSummaryForm from './WorkSummaryForm';
import AnnualAssessmentForm from './AnnualAssessmentForm';
import PatentForm from './PatentForm';
import SocialInsuranceProofForm from './SocialInsuranceProofForm';
import UnitApprovalProofForm from './UnitApprovalProofForm';

const ApplicationForm = ({ applicationId }) => {
    const [activeTab, setActiveTab] = useState('basicInfo');
    const [applicationData, setApplicationData] = useState(null);
    const [loading, setLoading] = useState(true);
    const [error, setError] = useState(null);

    useEffect(() => {
        const fetchApplicationData = async () => {
            try {
                const response = await axios.get(`/api/applications/${applicationId}`);
                setApplicationData(response.data);
            } catch (err) {
                setError(err);
            } finally {
                setLoading(false);
            }
        };

        if (applicationId) {
            fetchApplicationData();
        }
    }, [applicationId]);

    if (loading) return <div>加载中...</div>;
    if (error) return <div>加载失败: {error.message}</div>;
    if (!applicationData) return <div>未找到申报数据。</div>;

    const renderForm = () => {
        switch (activeTab) {
            case 'basicInfo':
                return <PersonalInfoForm applicationId={applicationId} initialData={applicationData.personalInfo} />;
            case 'educationInfo':
                return <EducationInfoForm applicationId={applicationId} />;
            case 'academicOrganizations':
                return <AcademicOrganizationsForm applicationId={applicationId} />;
            case 'currentQualifications':
                return <CurrentQualificationsForm applicationId={applicationId} />;
            case 'industryQualifications':
                return <IndustryQualificationsForm applicationId={applicationId} />;
            case 'socialPositions':
                return <SocialPositionsForm applicationId={applicationId} />;
            case 'awards':
                return <AwardsForm applicationId={applicationId} />;
            case 'punishments':
                return <PunishmentsForm applicationId={applicationId} />;
            case 'workExperience':
                return <WorkExperienceForm applicationId={applicationId} />;
            case 'continuingEducation':
                return <ContinuingEducationForm applicationId={applicationId} />;
            case 'academicAchievements':
                return <AcademicAchievementsForm applicationId={applicationId} />;
            case 'workAchievements':
                return <WorkAchievementsForm applicationId={applicationId} />;
            case 'workSummary':
                return <WorkSummaryForm applicationId={applicationId} />;
            case 'annualAssessment':
                return <AnnualAssessmentForm applicationId={applicationId} />;
            case 'patent':
                return <PatentForm applicationId={applicationId} />;
            case 'socialInsuranceProof':
                return <SocialInsuranceProofForm applicationId={applicationId} />;
            case 'unitApprovalProof':
                return <UnitApprovalProofForm applicationId={applicationId} />;
            default:
                return <div>请选择一个选项。</div>;
        }
    };

    return (
        <div className="application-form-container">
            <div className="sidebar">
                <div className="sidebar-header">职称评审申报</div>
                <ul className="nav-list">
                    <li className={activeTab === 'basicInfo' ? 'active' : ''} onClick={() => setActiveTab('basicInfo')}>申报基本信息</li>
                    <li className={activeTab === 'educationInfo' ? 'active' : ''} onClick={() => setActiveTab('educationInfo')}>学历学位信息</li>
                    <li className={activeTab === 'academicOrganizations' ? 'active' : ''} onClick={() => setActiveTab('academicOrganizations')}>参加学术团体情况</li>
                    <li className={activeTab === 'currentQualifications' ? 'active' : ''} onClick={() => setActiveTab('currentQualifications')}>专业技术资格(职业资格)</li>
                    <li className={activeTab === 'industryQualifications' ? 'active' : ''} onClick={() => setActiveTab('industryQualifications')}>行业职业资格</li>
                    <li className={activeTab === 'socialPositions' ? 'active' : ''} onClick={() => setActiveTab('socialPositions')}>社会兼职情况</li>
                    <li className={activeTab === 'awards' ? 'active' : ''} onClick={() => setActiveTab('awards')}>奖励情况</li>
                    <li className={activeTab === 'punishments' ? 'active' : ''} onClick={() => setActiveTab('punishments')}>惩罚情况</li>
                    <li className={activeTab === 'workExperience' ? 'active' : ''} onClick={() => setActiveTab('workExperience')}>工作经历</li>
                    <li className={activeTab === 'continuingEducation' ? 'active' : ''} onClick={() => setActiveTab('continuingEducation')}>继续教育情况</li>
                    <li className={activeTab === 'academicAchievements' ? 'active' : ''} onClick={() => setActiveTab('academicAchievements')}>学术成果信息</li>
                    <li className={activeTab === 'workAchievements' ? 'active' : ''} onClick={() => setActiveTab('workAchievements')}>工作业绩</li>
                    <li className={activeTab === 'workSummary' ? 'active' : ''} onClick={() => setActiveTab('workSummary')}>工作总结</li>
                    <li className={activeTab === 'annualAssessment' ? 'active' : ''} onClick={() => setActiveTab('annualAssessment')}>年度考核信息</li>
                    <li className={activeTab === 'patent' ? 'active' : ''} onClick={() => setActiveTab('patent')}>发明专利</li>
                    <li className={activeTab === 'socialInsuranceProof' ? 'active' : ''} onClick={() => setActiveTab('socialInsuranceProof')}>社保缴费证明</li>
                    <li className={activeTab === 'unitApprovalProof' ? 'active' : ''} onClick={() => setActiveTab('unitApprovalProof')}>单位同意申报证明</li>
                </ul>
            </div>
            <div className="main-content">
                {renderForm()}
            </div>
        </div>
    );
};

export default ApplicationForm;


